/**
 * Created by Lcs on 2017/5/19.
 */
import React from "react";
import {
  StyleSheet, Text, View, Image,
} from "react-native";
import PropTypes from "prop-types";

import Buttom from "./NCButton";
import { Color, ScreenHeight, FontSize } from "../../common/index";

const EmptyView = props => {
  const {
    desc, btnText, style, textStyle, buttonStyle, onPress, buttonTextStyle,
  } = props;
  const hasTx = desc && desc !== "";
  const hasBtn = btnText && btnText !== "";
  return (
    <View style={[styles.container, style]}>
      <Image source={require("../../img/img_task_empty.png")} />
      {hasTx ? <Text style={[styles.text_desc, textStyle]}>{desc}</Text> : null}
      {hasBtn ? (
        <Buttom
          buttonStyle={[styles.btnContainer, buttonStyle]}
          onPress={onPress}
          title={btnText}
          textStyle={[styles.btn_text_style, buttonTextStyle]}
        />
      ) : null}
    </View>
  );
};

EmptyView.propTypes = {
  onPress: PropTypes.func,
  desc: PropTypes.string,
  btnText: PropTypes.string,
  textStyle: PropTypes.any,
  buttonStyle: PropTypes.any,
  buttonTextStyle: PropTypes.any,
};

EmptyView.defaultProps = {
  desc: "",
  btnText: "",
  onPress: () => {},
  textStyle: {},
  buttonStyle: {},
  buttonTextStyle: {},
};

const styles = StyleSheet.create({
  container: {
    flex: 1,
    paddingTop: ScreenHeight / 8,
    alignItems: "center",
    backgroundColor: Color.white,
  },
  text_desc: {
    fontSize: FontSize.SIZE_14,
    color: Color.text_assist,
    marginTop: 21,
  },
  btnContainer: {
    height: 28,
    width: 80,
    borderRadius: 14,
    borderWidth: 0,
    marginTop: 20,
    backgroundColor: Color.colorPrimary,
  },
  btn_text_style: {
    fontSize: FontSize.SIZE_15,
    color: Color.white,
  },
});
export default EmptyView;
